<template>
    <div>
        <div class="crumbs">
            <el-breadcrumb separator="/">
                <el-breadcrumb-item><i class="el-icon-date"></i>成员信息设置</el-breadcrumb-item>
            </el-breadcrumb>
        </div>
    
     <el-form label-width="80px">
      
    <el-form-item label="姓名:">
    <el-input v-model="unewdata.owe_u_name" auto-complete="off"  placeholder="姓名" class="handle-input"></el-input>
    </el-form-item>

    <el-form-item label="选择战队:">
                    <el-select v-model="unewdata.owe_u_group" placeholder="请选择战队">
                        <el-option v-for='(item,index) in typeCenter' :key="index" :label="item.owe_group_title" :value="item.owe_group_id"></el-option>
                    </el-select>
     </el-form-item>

   <el-form-item label="头像:">
   <el-upload class="avatar-uploader" name='image' :action="uploadURI"  :show-file-list="false" :on-success="handleAvatarSuccess">
   <img v-if="unewdata.owe_u_show_avatar" :src="unewdata.owe_u_show_avatar" class="avatar">
    <i v-else class="el-icon-plus avatar-uploader-icon"></i>
  </el-upload>
<el-dialog :visible.sync="dialogVisible" size="tiny">
  <img width="100%" :src="dialogImageUrl" alt="">
</el-dialog>
    </el-form-item>


    <el-form-item label="封面图:">
   <el-upload class="avatar-uploader" name='image' :action="uploadURI"  :show-file-list="false" :on-success="handleCoverSuccess">
   <img v-if="unewdata.owe_u_show_cover" :src="unewdata.owe_u_show_cover" class="avatar">
    <i v-else class="el-icon-plus avatar-uploader-icon"></i>
  </el-upload>
<el-dialog :visible.sync="dialogVisible" size="tiny">
  <img width="100%" :src="dialogImageUrl" alt="">
</el-dialog>
    </el-form-item>


        <el-form-item label="身高:">
    <el-input v-model="unewdata.owe_u_height" auto-complete="off"   placeholder="身高(cm)" class="handle-input"></el-input>
    </el-form-item>

     <el-form-item label="人气值:">
    <el-input v-model="unewdata.owe_u_popular" auto-complete="off" type="number" placeholder="人气值" class="handle-input"></el-input>
    </el-form-item>

        <el-form-item label="座右铭:">
      <el-input v-model="unewdata.owe_u_say" auto-complete="off"   type="text"  placeholder="座右铭"  class="handle-input"></el-input>
    </el-form-item>


    <el-form-item label="系统备注:">
      <el-input v-model="unewdata.owe_u_remark" auto-complete="off"   type="text"  placeholder="系统备注"  class="handle-input"></el-input>
    </el-form-item>


    
                <el-form-item label="成员状态:">
                  
                        <el-radio  v-model="unewdata.owe_u_state"  :label="1">出场</el-radio>
                        <el-radio  v-model="unewdata.owe_u_state"  :label="0">冻结</el-radio>
                   
                </el-form-item>

  </el-form>
  <div slot="footer" class="dialog-footer">
    <el-button  type="danger" @click="updateMinfo">保存</el-button>
  </div>


    </div>
</template>

<script>
import * as Login from '../../service/login'
import * as rpConfig from '../../../rpConfig/constant'
import { HttpReq } from '../../service/server'
var Server = new HttpReq()
export default {
    data: () => ({
        uploadURI: rpConfig.API_URI + '/Helpapi/uploadImg',
        dialogImageUrl: '',
        dialogVisible: false,
        typeCenter:[],
        unewdata: {

            owe_u_id: 0,
            owe_u_avatar: '',
            owe_u_show_avatar: '',
            owe_u_cover:'',
            owe_u_show_cover: '',
            owe_u_name: '',
            owe_u_height: '',
            owe_u_group: '',
            owe_u_popular: 0,
            owe_u_state: 1,
            owe_u_say:"",
            owe_u_remark:""
   
        }
    }),
    methods: {


        handleAvatarSuccess(res) {
    
            if (res.code != 200) {
                this.$message.error(res.msg)
            } else {
                this.unewdata.owe_u_show_avatar = res.data.url
                this.unewdata.owe_u_avatar = res.data.saveUrl
            }
        },
        handleCoverSuccess(res) {
    
            if (res.code != 200) {
                this.$message.error(res.msg)
            } else {
                this.unewdata.owe_u_show_cover = res.data.url
                this.unewdata.owe_u_cover = res.data.saveUrl
            }
        },
        getMemberInfo(memberId){
            let self = this
            Server._POST(
                rpConfig.API_URI + '/oweset.Member/getMemberDetail',
                {member_id:memberId},
                function(data) {

                    self.unewdata.owe_u_id=data.data.owe_u_id
                    self.unewdata.owe_u_avatar=data.data.owe_u_avatar
                    self.unewdata.owe_u_show_avatar=data.data.owe_u_show_avatar
                    self.unewdata.owe_u_cover=data.data.owe_u_cover
                    self.unewdata.owe_u_show_cover=data.data.owe_u_show_cover
                    self.unewdata.owe_group_logo=data.data.owe_group_logo
                    self.unewdata.owe_u_name=data.data.owe_u_name
                    self.unewdata.owe_u_height=data.data.owe_u_height
                    self.unewdata.owe_u_popular=data.data.owe_u_popular
                    self.unewdata.owe_u_state=data.data.owe_u_state
                    self.unewdata.owe_u_group=data.data.owe_u_group
                    self.unewdata.owe_u_remark=data.data.owe_u_remark
                    self.unewdata.owe_u_say=data.data.owe_u_say
                    self.unewdata.owe_u_state=data.data.owe_u_state
                
                }
            )
        },
        updateMinfo() {
            let self = this
            Server._POST(
                rpConfig.API_URI + '/oweset.Member/saveMemberInfo',
                self.unewdata,
                function(data) {
                    self.$message.success(data.msg)
                    setTimeout(() => {
                        self.$router.push('/owemember')
                    }, 2000)
                }
            )
        },
             getType() {
            let self = this
            Server._POST(rpConfig.API_URI + '/oweset.Member/getUserGroup', {}, function(response) {
             
                self.typeCenter = response.data
            
            })
        },
    },
    mounted() {
      
        this.getType()
        let memberId = this.$route.params.memberId
        if(memberId){
            this.getMemberInfo(memberId)
        }
  
        
    }
}
</script>

<style>
.avatar-uploader .el-upload {
  border: 1px dashed #d9d9d9c2;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}

.avatar-uploader .el-upload:hover {
  border-color: #409eff;
}

.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 178px;
  height: 178px;
  line-height: 178px;
  text-align: center;
}

.avatar {
  width: 178px;
  height: 178px;
  display: block;
}
</style>

</style>


